<extend name="./Common/View/Public/form.html" />
<block name="page_title">添加用户</block>
<block name="main">
    <form class="layui-form" method="post" action="#" lay-filter="pageForm">
            <div class="layui-form-item">
                <label class="layui-form-label">用户类型</label>
                <div class="layui-input-inline">
                    <input type="checkbox" name="types" lay-filter="types" lay-skin="switch" lay-text="老师|学生" <if condition="I('request.types') neq 'student'">checked</if> >
                </div>
                <div class="layui-form-mid layui-word-aux">老师或学生</div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">评价项目</label>
                <div class="layui-input-block">
                    <select name="project_id" id="project_id" lay-filter="project_id" lay-verify="required" api="rate/project/slist" value="{$project.id}" affect="reload" empty="评价项目">
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">参与方式</label>
                <div class="layui-input-block">
                    <select name="type" id="type" lay-filter="type" api="sys/Dict/info/code/RATE_USER_TYPE" value="{$Think.request.type}" affect="reload" empty="参与类型"></select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">已选择</label>
                <div class="layui-input-block" id="selects">
                    <volist name="list" id="vo">
                        <input type="checkbox" name="user[{$vo.user_id}]" lay-filter="user" value="{$vo.user_id}" id="{$vo.user_id}" title="{$vo.name}" checked>
                    </volist>
                </div>
            </div>
            <if condition="I('request.types') eq 'student'">

                <div class="layui-form-item">
                    <label class="layui-form-label">专业</label>
                    <div class="layui-input-block">
                        <select name="depart_id" id="depart_id" lay-filter="depart_id" api="base/Department/slist/status/1/type/3" affect="#class_id" empty="所在专业"></select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">年级</label>
                    <div class="layui-input-block">
                        <select name="grade" id="grade" lay-filter="grade" api="sys/Config/grade" affect="#class_id" empty="年级"></select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">班级</label>
                    <div class="layui-input-block">
                        <select name="class_id" id="class_id" lay-filter="class_id" api="base/Class/slist" depend="#grade,#depart_id" empty="班级"></select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">学生</label>
                    <div class="layui-input-block" id="students">
                    </div>
                </div>
                <else />
                <div class="layui-form-item">
                    <label class="layui-form-label">部门</label>
                    <div class="layui-input-block">
                        <select name="teacher_depart" lay-filter="teacher_depart" tree="base/department/tree" empty="请选择部门"></select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">老师</label>
                    <div class="layui-input-block" id="teachers">
                    </div>
                </div>
            </if>
        </form>
    </block>


<block name="script">
    <script>
        layui.use(['form', 'layer', 'element', 'jquery'], function () {
            window.jQuery = window.$ = layui.jquery;
            var form = layui.form
                    , layer = layui.layer
                    ,element = layui.element;

            form.on('switch(types)',function (data) {
                window.location =  app.appendLocation('types', data.elem.checked ?  'teacher' : 'student');
            });

            form.on('select(teacher_depart)',function (data) {
                var str = '';
                $.getJSON(app.api + 'base/teacher/slist/depart_id/'+data.value, function(res){
                    if(res.error == '0' && res.data != null && res.data.length >0){
                        for(var i=0; i<res.data.length; i++) {
                            str += '<input type="checkbox" lay-filter="teacher" name="user['+res.data[i]['id']+']" value="'+res.data[i]['user_id']+'" title="'+res.data[i]['name']+'" ';
                            if($('#'+res.data[i]['user_id']).length > 0) str += 'checked';
                            str +=' >';
                        }
                    }
                    $('#teachers').empty().append(str);
                    form.render('checkbox');
                });
            });
            form.on('select(class_id)',function (data) {
                var str = '';
                $.getJSON(app.api + 'base/student/slist/class_id/'+data.value, function(res){
                    if(res.error == '0' && res.data != null && res.data.length >0){
                        for(var i=0; i<res.data.length; i++) {
                            str += '<input type="checkbox" lay-filter="teacher" name="user['+res.data[i]['id']+']" value="'+res.data[i]['user_id']+'" title="'+res.data[i]['name']+'" ';
                            if($('#'+res.data[i]['user_id']).length > 0) str += 'checked';
                            str +=' >';
                        }
                    }
                    $('#students').empty().append(str);
                    form.render('checkbox');
                });
            });

            form.on('checkbox(user)', function(data){
                if(!data.elem.checked){
                    var fdata = new Object();
                    fdata['project_id'] = '{$project.id}';
                    fdata['user_id'] =  data.value;
                    app.post('rate/user/del', fdata, function(res){
                        $(data.elem).remove();
                        $(data.othis).remove();
                        form.render('checkbox', 'user');
                    });
                }
            });
            form.on('checkbox(teacher)', function(data){
                if(data.elem.checked){
                    var fdata = new Object();
                    fdata['type'] = '{$Think.request.type}';
                    fdata['project_id'] = '{$project.id}';
                    fdata['user_id'] =  data.value;
                    fdata['name'] =  data.elem.title;
                    app.post('rate/user/insert', fdata, function(res){
                        $('#selects').append('<input type="checkbox" lay-filter="user" id="'+data.value+'" value="'+data.value+'" name="user['+data.value+']" title="'+data.elem.title+'" checked>');
                        form.render('checkbox');
                    });
                }else{
                    $(data.elem).remove();
                    $(data.othis).remove();
                }
            });
            form.on('checkbox(student)', function(data){
                if(data.elem.checked){
                    var fdata = new Object();
                    fdata['type'] = '{$Think.request.type}';
                    fdata['project_id'] = '{$project.id}';
                    fdata['user_id'] =  data.value;
                    fdata['name'] =  data.elem.title;
                    app.post('rate/user/insert', fdata, function(res){
                        $('#selects').append('<input type="checkbox" lay-filter="user" id="'+data.value+'" name="user['+data.value+']" title="'+data.elem.title+'" checked>');
                        form.render('checkbox');
                    });
                }else{
                    $(data.elem).remove();
                    $(data.othis).remove();
                    form.render('checkbox');
                }
            });
        });
    </script>
</block>